<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/commons/include.jsp"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<title>JavaScript Demo</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<link />
	<style type="text/css">
		#container{
		    width: 760px;
		    height: 600px;
		    margin: 30px auto;
		    /* IE fix 居中布局 */
		    text-align: center;
		}
		 
		#main{
		    width: 760px;
		    height: 600px;
		    margin: 30px auto;
		    /* IE fix 居中布局 */
		 	text-align: left;
		}
	</style>
	
	<script type="text/javascript">
		/*
			再谈javascript面向对象编程
			http://coolshell.cn/articles/6668.html
		*/
	
		var newLine = "<br/>";	
		
		/*
		在js里函数、数组也是对象
		*/
		var obj1 = {};
		var fun1 = function(){};
		var array1 = [1, 2, 3];
		
		/*
		__proto__成员只在Firefox中定义
		函数对象prototype成员
		*/
		function Base() {
			this.id = "base";
		}
		
		/* 
		new操作符
		干了三件事
		var obj  = {};
		obj.__proto__ = Base.prototype;
		Base.call(obj);
		第一行，我们创建了一个空对象obj
		第二行，我们将这个空对象的__proto__成员指向了Base函数对象prototype成员对象
		第三行，我们将Base函数对象的this指针替换成obj，然后再调用Base函数，
		于是我们就给obj对象赋值了一个id成员变量，这个成员变量的值是”base”
		*/
		var obj2 = new Base();
		
		// 给Base.prototype的对象添加一些函数
		Base.prototype.toString = function() {
			return this.id;
		}
		
		/* Pseudoclassical 继承 */
		function Derive(id) {
			this.id = id;
		}
		Derive.prototype = new Base();
		Derive.prototype.test = function(id) {
			this.id = id;
		}
		
		var newDerive = new Derive("derive");
		
		/* Prototypal继承 */
		function object(obj) {
			function F() {};
			F.prototype = obj;
			return new F();
		}
		
		var base = {
				id: 'base', 
				toString: function(){
					return this.id;
				}
		}
		
		var newDerive2 = object(base);
		
		
	</script>
</head>

<body>
	<div id="container">
		<div id="main">
				
		</div>
	</div>
</body>
</html>
